<!doctype html>
<html>
<head>
<style>
    * { margin:0; padding:0; font:12px Tahoma; line-height:110%; }
    h3 { font-size:12px; font-weight:bold; margin-bottom:5px; }
    .container { background:#DDD; width:95px; height:70px; margin-bottom:3px; }
    .in { display:inline; }
    .bl { display:block; width:45px; }
    .ib { display:inline-block; width:45px; }
    .prev { background:#BBB; }
    .pos { position:absolute; width:45px; height:45px; }
    .next { background:#777; }
    html* .ib { display:inline; }
</style> 
</head>
<body>
<div style="float:left; display:inline; margin-right:3px;">

    <h3>POSITIONED</h3>
    <div class="container">
        <span class="prev in">INLINE</span><span class="pos next in">INLINE POS</span>
    </div>
    <div class="container">
        <span class="prev in">INLINE</span><div class="pos next bl">BLOCK POS</div>
    </div>
    <div class="container">
        <span class="prev in">INLINE</span><div class="pos next ib">INLINE BLOCK POS</div>
    </div>
</div>
<div style="float:left; display:inline;">
    <h3>STATIC</h3>
    <div class="container">
        <span class="prev in">INLINE</span><span class="next in">INLINE STATIC</span>
    </div>
    <div class="container">
        <span class="prev in">INLINE</span><div class="next bl">BLOCK STATIC</div>
    </div>
    <div class="container">
        <span class="prev in">INLINE</span><div class="next ib">INLINE BLOCK STATIC</div>
    </div>
</div>
</body>
</html>
